<!DOCTYPE html>
<html lang="en"  xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.w3.org/1999/xhtml" >
<head>
    <meta charset="UTF-8">
    <link rel="shortcut icon" th:href="@{/chqimage/favicon.ico}" type="image/x-icon">
    <title>其他当事人</title>
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <link rel="stylesheet"  th:href="@{/chqcss/other-dsr.css}">
    <script type="text/javascript"  th:src="@{/chqjs/jquery.min.js}"></script>
    <script type="text/javascript"  th:src="@{/chqjs/vue.min.js}"></script>
</head>
<body>

<!--顶部标题-->
<div id="head">
    <a href="mediate-guide.html" class="return_img float_left"><img src="/chqimage/icon-fanh.png" alt=""></a>
    <p class="head_title">添加其他当事人</p>
</div>
<!--主要内容盒子-->
<div id="otherDsr_box">
    <!--小崇提示-->
    <div class="prompt">为及时通知其他当事人参加调解，请填写其他当事人信息，如有疑问，请咨询我</div>
    <ul class="dsr_list">
        <li class="dsr" v-for="(dsr,i) in dsrList">
            <p>
                <span class="required">*</span><span>姓名</span>
                <input type="text" v-model="dsr.dsrName" placeholder="请输入" class="dsr_name float_right">
            </p>
            <p>
                <span class="required">*</span><span>电话</span>
                <input type="number" v-model="dsr.dsrTel" placeholder="请输入" class="dsr_tel float_right">
            </p>
        </li>
    </ul>
    <div class="add_box" @click="add" ><img src="/chqimage/icon-tianjia.png" alt=""><span>添加其他当事人</span></div>
    <!--下一步-->
    <a class="next_step" @click="confirm">确定</a>
</div>

<script>
 new Vue({
    el:'#otherDsr_box',
    data:{
        dsrList:[
            {dsrName:'', dsrTel:''}
        ]
    },
    methods:{
        add:function () {
           this.dsrList.push({
                dsrName:'',
                dsrTel:''
           })
        },
        confirm:function () {
            var dsrInfo = [];
//            console.log(this.dsrList);
            for(var i=0;i<this.dsrList.length;i++){
                dsrInfo.push({
                    dsrName:this.dsrList[i].dsrName,
                    dsrTel:this.dsrList[i].dsrTel
                })
            }
            dsrInfo = JSON.stringify(dsrInfo);
            $.ajax({
                url:'/user/dsr',
                type: 'post',
                contentType : 'application/json;charset=utf-8',
                data:dsrInfo,
                datatype:'json',
                success:function (result) {
                    console.log(result);
                    window.location.href = '/user/choice-mediate';
                },
                error:function (err) {
                    console.log('错误'+err);
                }
            })
        }
    }
})
</script>


</body>
</html>